import React from 'react';
import { bindActionCreators } from 'redux';
import { connect } from 'react-redux';
import { push } from 'react-router-redux';

import * as CounterActions from '../actions';
import Counter from '../components/Counter';

const CounterPage = ({counter, actions, jumpTo }) => {
  return (
    <div>
      <Counter data={counter} actions={actions} jumpTo={jumpTo}/>
    </div>
  )
};

const mapStateToProps = state => ({
  counter: state.toJS().counter,
});

const mapDispatchToProps = dispatch => ({
  actions: bindActionCreators(CounterActions, dispatch),
  jumpTo: () => {
    dispatch(push('/bar'));
  },
})

export default connect(mapStateToProps, mapDispatchToProps)(CounterPage);
